<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<title>学生管理</title>
		<link rel="stylesheet" href="../res/layui/css/layui.css">
	</head>
	<body>
		<table id="demo" lay-filter="test"></table>
		
		<script src="../res/jquery/jquery.min.js"></script>
		<script src="../res/layui/layui.js"></script>
		<script src="../res/js/public.js"></script>
		<script src="../res/js/ajax-hook.js"></script>
		<script>
			//JavaScript代码区域
			layui.use(['table', 'layer'], function() {
				var table = layui.table, layer = layui.layer;
				
				//表格数据渲染
				var tableIns = table.render({
					elem: '#demo', 
					url: '/api/stu/page',
					page: true,
					request : {
						pageName : 'pageNum',
						limitName : 'pageSize'
					},
					parseData: function(res){
						return {
						  "code": res.code, //解析接口状态
						  "msg": res.msg, //解析提示文本
						  "count": res.data.totalElements, //解析数据长度
						  "data": res.data.content //解析数据列表
						};
					},
					cols : [[ //表头
						//{field : '', type:'numbers', title: '序号'},
						{type:'radio'},
						{field : 'name', title: 'Name'}
					]],
					text: {
						none: '暂无相关数据' //默认：无数据。注：该属性为 layui 2.2.5 开始新增
					},
					loading: true,
					toolbar: 'default',
					defaultToolbar: ['filter', 'print', 'exports'],
					title: '学生数据',
				});
				
				//监听头部工具栏事件
				table.on('toolbar(test)', function(obj){
				  var checkStatus = table.checkStatus(obj.config.id);
				  switch(obj.event){
					case 'add':
					  layer.msg('添加');
						//测试ajax-hook 444
						$.get("/api/stu/test",function(data,status){
						});
					break;
					case 'delete':
					  layer.msg('删除');
					  var data = checkStatus.data;  //获取选中行数据
					  if(data.length>0){
						  layer.alert(JSON.stringify(data));
					  }else{
						  layer.alert('请选中目标数据行！');
					  }
					  
					break;
					case 'update':
					  layer.msg('编辑');
					  var data = checkStatus.data;  //获取选中行数据
					  if(data.length>0){
						  layer.alert(JSON.stringify(data));
					  }else{
						  layer.alert('请选中目标数据行！');
					  }
					break;
				  };
				});
			});
		</script>
	</body>
</html>
